<template>
  <a-form @submit='handleSubmit' :model='model' :rules='validatorRules'>
    <a-row>
      <a-col :lg='4' :md='12' :sm='24'>
        <a-form-item label='姓名' :labelCol='{lg: {span:5}}' :wrapperCol='{lg:{span:19}}'>
          <a-input
            placeholder='请输入姓名'
          />
        </a-form-item>
      </a-col>
      <a-col :lg='4' :md='12' :sm='24' :offset='1'>
        <a-form-item :labelCol='{lg: {span:9}}' :wrapperCol='{lg:{span:15}}'
                     label='证件类型'>
          <a-select placeholder='请选择证件类型'>
            <a-select-option value='身份证'>身份证</a-select-option>
            <a-select-option value='护照'>护照</a-select-option>
            <a-select-option value='港澳通行证'>港澳通行证</a-select-option>
          </a-select>
        </a-form-item>
      </a-col>
      <a-col :lg='6' :md='12' :sm='24' :offset='1'>
        <a-form-item label='证件号' :labelCol='{lg: {span:6}}' :wrapperCol='{lg:{span:18}}'>
          <a-input
            placeholder='请输入证件号'
           />
        </a-form-item>
      </a-col>
      <a-col :lg='6' :md='12' :sm='24' :offset='1'>
        <a-form-item label='性别' :labelCol='{lg: {span:4}}' :wrapperCol='{lg:{span:20}}'>
<!--          <j-dict-select-tag type="list" v-model="model.sex" dictCode="" placeholder="请选择性别" />-->
          <a-radio-group v-model="model.sex" name="sex">
            <a-radio value="1">男</a-radio>
            <a-radio value="2">女</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
    </a-row>
    <a-row>
      <a-col :lg='5' :md='12' :sm='24'>
        <a-form-item label='出生日期' :labelCol='{lg: {span:7}}' :wrapperCol='{lg:{span:17}}'>
          <j-date placeholder="请选择出生日期" v-model="model.birthDate" style="width: 100%" />
        </a-form-item>
      </a-col>
      <a-col :lg='4' :md='12' :sm='24' :offset='1'>
        <a-form-item label='年龄' :labelCol='{lg: {span:5}}' :wrapperCol='{lg:{span:19}}'>
          <a-input-number v-model="model.age" placeholder="请输入年龄" style="width: 100%" />
        </a-form-item>
      </a-col>
      <a-col :lg='6' :md='12' :sm='24' :offset='1'>
        <a-form-item label='手机号' :labelCol='{lg: {span:6}}' :wrapperCol='{lg:{span:18}}'>
          <a-input placeholder='请输入手机号' />
        </a-form-item>
      </a-col>
    </a-row>
    <a-row>
      <a-col :lg='6' :md='12' :sm='24'>
        <a-form-item label='现住址' :labelCol='{lg: {span:5}}' :wrapperCol='{lg:{span:18}}'>
          <j-area-linkage type="cascader" v-model="model.nowAddressRegion" placeholder="请输入省市区" />
        </a-form-item>
      </a-col>
      <a-col :lg='12' :md='12' :sm='24' :offset='1'>
        <a-form-item label='详细地址' :labelCol='{lg: {span:3}}' :wrapperCol='{lg:{span:21}}'>
          <a-input placeholder='请输入详细地址' />
        </a-form-item>
      </a-col>
    </a-row>
  </a-form>
</template>

<script>
export default {
  name: 'BasicInfo',
  data() {
    return {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },
      model: {}
    }
  },
  methods: {
    handleSubmit(e) {
      e.preventDefault()
      this.form.validateFields((err, values) => {
        if (!err) {
          this.$notification['error']({
            message: 'Received values of form:',
            description: values
          })
        }
      })
    }
  }
}
</script>

<style scoped>

</style>